<script type="text/html" template lay-done="layui.data.selfDepartmentdone(d);">
    <div class='temporary-pastHtml-content layui-form' lay-filter="personnel-of-unit">
        <div class="layui-row">
            <div class="layui-col-md12">
                <div class="layui-card-header">
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label">姓名：</label>
                            <div class="layui-input-inline">
                                <input type="text" name="username" autocomplete="off" class="layui-input layui-input-username">
                            </div>
                            <label class="layui-form-label">单位：</label>
                            <div class="layui-input-inline">
                                <input type="text" name="deptname" autocomplete="off" class="layui-input layui-input-deptname">
                            </div>
                            <button class='layui-btn layui-btn-normal layui-btn-xs layui-btn-query'>查询</button>
                        </div>
                    </div>
                </div>
                <div class="ztreeContainer">
                    <table id="self-table" lay-filter="self-company-table"></table>
                </div>
                <div class="group-check">
                    <div class="check-value-box" id="assignName">
                        {{# layui.each(d.params.checkIds , function(index, item) {  }}
                            <div class="unit-content">
                                <a href="javascript:void(0)">{{item.userName}}</a>
                                <i class="layui-icon layui-icon-close del-tag" data-target="delName" data-usercode="{{item.user_code}}" data-certcode="{{item.cert_code}}" data-deptnme="{{item.dept_name}}" data-phone="{{item.phone}}" data-email="{{item.email}}"></i>
                            </div>
                        {{#  }) }}
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-row" style="text-align: center;margin-top: 15px;">
            <div class="data-review-container" style="display: none;"></div>
            <button type="button" class="layui-btn T-confirm">确认</button>
        </div>
    </div>
</script>

<script type="text/html" id="assginTaskTpl">
    {{# layui.each(d, function(index, item) {  }}
        <div class="unit-content">
            <a href="javascript:void(0)">{{item.userName}}</a>
            <i class="layui-icon layui-icon-close del-tag" data-target="delName" data-usercode="{{item.user_code}}" data-certcode="{{item.cert_code}}"  data-deptnme="{{item.dept_name}}" data-phone="{{item.phone}}" data-email="{{item.email}}"></i>
        </div>
    {{#  }) }}
</script>

<style>
    .temporary-pastHtml-content {
        padding: 0px 10px;
    }

    .temporary-pastHtml-content .ztreeContainer {
        height: 400px;
        overflow-y: auto;
    }

    .temporary-pastHtml-content .department-check,
    .temporary-pastHtml-content .group-check {
        height: 70px;
        border: 1px solid #ccc;
        margin: 15px 0px 0px 13px;
        padding: 2px 2px;
    }

    .temporary-pastHtml-content .check-value-box {
        width: 100%;
        height: 100%;
        overflow-y: auto;
    }

    .unit-content{
        display: inline-block;
        padding: 0 15px 0 5px;
        background-color: #ccc;
        position: relative;
        height: 24px;
        line-height: 24px;
        margin-bottom: 2px;
    }
    .unit-content a:hover{
        text-decoration: underline;
    }
    .unit-content:hover i{
        visibility: visible;
        color: red;
        font-weight: bold;
    }
    .unit-content i {
        position: absolute;
        right: 0px;
        top: -2px;
        font-size: 14px;
        cursor: pointer;
        visibility: hidden;
    }
    .temporary-pastHtml-content .layui-table th, .temporary-pastHtml-content .layui-table td{
        text-align: center;
    }
    .temporary-pastHtml-content .layui-card-header{
        height: 45px;
        line-height: 45px;
        padding: 0;
    }
    .temporary-pastHtml-content .layui-card-header  .layui-form-label{
        padding: 12px 0;
        width:  auto;
    }
    .temporary-pastHtml-content .layui-card-header .layui-inline{
        margin-bottom: 0;
    }
    .temporary-pastHtml-content .layui-card-header .layui-input-inline{
        width: 187px;
        padding-top: 8px;
    }
    .temporary-pastHtml-content .layui-card-header .layui-input{
        height: 30px;
    }
    .temporary-pastHtml-content .layui-card-header .layui-btn{
        width: 60px;
        height: 25px;
        line-height: 25px;
        background-color: #2669B1;
    }
    .temporary-pastHtml-content .layui-table-grid-down {
        display: none;
    }
    .temporary-pastHtml-content .layui-table-grid-down .layui-icon {
        display: none;
    }
</style>
<script>
    layui.data.selfDepartmentdone = function (d) {
        layui.use(['admin', 'table', 'form', 'laytpl'], function () {
            var admin = layui.admin,
                table = layui.table,
                form = layui.form,
                $ = layui.jquery,
                laytpl = layui.laytpl,
                onlyUnit = d.params.onlyUnit ? d.params.onlyUnit : '',
                allStaff = d.params.checkIds ? d.params.checkIds : [],
                grade = d.params.showDetail ? d.params.showDetail : '',
                selectUser = d.params.selectUser ? d.params.selectUser : '';
                userdata = layui.data('userdata').data;

            //复核人表格加载
            function initTable(type){
                var params = {};
                if(type == 'init'){
                    params = {grade: 'true'}
                }else if(type == 'select'){
                    params = { 
                        userName: window.userName,
                        deptName: window.deptName
                    }
                    grade ? params.grade = grade : '';
                }
                params.access_token = layui.data('layuiAdmin').access_token;
                !!selectUser ? params.id = selectUser : '';
                !!selectUser ? params.model = 'selectRoleuser' : params.model = 'selectAdduser';
                if(!!onlyUnit && onlyUnit === '1') {
                    params.deptId = userdata.dept_id;
                    params.model = 'select';
                }
                table.render({
                    elem: '#self-table',
                    height: '377',
                    url: 'myapi/DC/api/rest/web/custom/RoleUser',
                    method: 'post',
                    where: params,
                    text: {
                        none: '暂无相关数据'
                    },
                    request: {
                        limitName: 'count'
                    },
                    parseData: function(res){ 
                        var checkdata = res.data.data;
                        if(allStaff && allStaff.length > 0){ 
                            for(var i = 0; i < checkdata.length; i++){
                                checkdata[i].LAY_CHECKED = false;
                                for(var j = 0; j < allStaff.length; j++){
                                    if(checkdata[i].user_code === allStaff[j].user_code){
                                        checkdata[i].LAY_CHECKED = true;
                                    }
                                }
                            }
                        }
                        return {
                            "code": res.retcode, //解析接口状态
                            "msg": res.retmsg, //解析提示文本
                            "count": res.data.totalNumber, //解析数据长度
                            "data": checkdata //解析数据列表
                        }
                    }
                    ,cellMinWidth: 80 
                    ,page: true
                    ,cols: [[
                        {type: 'checkbox'}
                        ,{field:'userName', title: '姓名'}
                        ,{field: 'cert_code', title: '编码'}
                        ,{field:'dept_name', title: '单位',style: 'white-space:nowrap; overflow: hidden; text-overflow: ellipsis;',templet: function(d){
                            return '<span lay-tips='+ d.dept_name+'>'+ d.dept_name +'</span>'
                        }}
                        ,{field:'dept_level', title: '级别'}
                    ]]
                    ,skin: 'nob' 
                    ,even: true
                }); 
            }

            initTable('init'); //初始化表格

            //分页时选择框的数据为选中状态
            function getCheckUser(){
                var unitContent = $('#assignName .unit-content'),
                    exitReview = [];
                if(unitContent && unitContent.length > 0){
                    layui.each(unitContent, function(index, item){
                        var eachUser = item.querySelector('i'),
                            usercode = eachUser.getAttribute('data-usercode'),
                            username = item.querySelector('a').innerText;
                        exitReview.push({ user_code: usercode, userName: username});    
                    })
                }
                return exitReview;
            }

            //监听复选框
            table.on('checkbox(self-company-table)', function(obj){
                var checked = obj.checked,
                    checktype = obj.type,
                    $eachman = '';
                if(checktype == 'all'){
                    var allCheck = table.checkStatus('self-table'),
                        isAll = allCheck.isAll;
                    if(isAll){ //全选
                        layui.each(allCheck.data, function(t, each){
                            if(JSON.stringify(allStaff).indexOf(JSON.stringify(each)) == -1){
                                allStaff.push(each);
                            }
                        })
                    }else{ //取消全选
                        var checkdata = table.cache["self-table"];
                        layui.each(checkdata, function(index, item){
                            layui.each(allStaff, function(index2, content){
                                if(item.user_code == content.user_code){
                                    allStaff.splice(index2, 1);
                                }
                            })
                        })
                    }
                }else{
                    if(checked){ //选择人员时，如果allStaff没有这个人员，则添加
                        if(JSON.stringify(allStaff).indexOf(JSON.stringify(obj.data)) == -1){
                            allStaff.push(obj.data);
                        }
                    }else{ //取消选择时，则删掉这个人员
                        var removeUser = obj.data.user_code;
                        layui.each(allStaff, function(index, item){
                            if(item.user_code == removeUser){
                                allStaff.splice(index, 1);
                            }
                        })
                    }
                }
                var getTpl = assginTaskTpl.innerHTML,
                    $view = document.getElementById('assignName');
                laytpl(getTpl).render(allStaff, function(html){
                    $view.innerHTML = html;
                });
            });

            //监听取消已选择的姓名
            $('#assignName').delegate('.unit-content .del-tag', 'click', function(){
                var target = $(this).data('target');
                if(target == 'delName'){
                    var usercode =  $(this).data('usercode');
                    layui.each(allStaff, function(index, item){
                        if(item.user_code == usercode){
                            allStaff.splice(index, 1);
                        }
                    });
                    initTable('init'); //取消复选框选中
                    var getTpl = assginTaskTpl.innerHTML,
                        $view = document.getElementById('assignName');
                    laytpl(getTpl).render(allStaff, function(html){
                        $view.innerHTML = html;
                    });
                }
            })

            //查询复核人
            $('.layui-btn-query').click(function(){
                var username = $('.layui-input-username').val() || '',
                    deptname = $('.layui-input-deptname').val() || '';
                window.userName = username;
                window.deptName = deptname;
                initTable('select');
            })

            //姓名、单位输入框绑定查询事件
            $(document).keydown(function(event){
                if(event.keyCode == '13'){
                    $('.layui-btn-query').click();
                }
            })
        })
    }
</script>